<!DOCTYPE html>
<html>
<head>
        <% include global/meta.html %>
        <% include global/top-css.html %>
        <link rel="stylesheet" href="/public/lib/css/jquery.page.css">
        <title>yuscms系统</title>
</head>
<body>
        <% include global/header.html %>

        <section class="row pc-page pd-10 f-16">
            当前位置>
            <%for(let i=0,pos;i<data.position.length;i++){%>
                <%pos = data.position[i]%>
                <a href="/list/<%=pos.id%>">
                    <%=pos.nav_name%> 
                    <%if(i != data.position.length-1){%>
                        &gt;  
                    <%}%>   
                </a>
            <%}%>
        </section>

        <section class="row pc-page content">
            <div class="col-20 mr-10">
                <div class="row bg-f2f2f2">
                    <%if(data.articlelist.length>0){%>
                   <ul>
                       <%for(var i=0,list;i<data.articlelist.length;i++){%>
                           <%list = data.articlelist[i];%>
                       <li class="row pd-10">
                           <div class="list-img mr-10">
                                <a href="/article/<%=list.id%>">
                                    <img class="img" src="<%=list.thumbnail%>" width="150" height="100"  alt="">
                                </a>
                           </div>
                           <div class="list-info">
                               <h2 class="c-333">[<%=list.nav_name%>] <a href="/article/<%=list.id%>"><%=list.title%></a></h2>
                               <p class="c-999 mt-2">日期：<%=list.date%> 浏览：<%=list.count%> 好评：</p>
                               <p class="c-666 f-14 mt-4">核心提示：<a href="/article/<%=list.id%>"><%=list.info%></a></p>
                           </div>
                       </li>
                       <%}%>
                   </ul>
                   <%}else{%>
                    <p>没有任何数据！</p>
                    <%}%>
                </div>
                <div class="mt-10 bg-f3f3f3">

                    <div class="page text-c">
                        <ul class="pagination" id="page2"></ul>
                    </div>
                    
                </div>
            </div>
            <div class="col-4 bg-f3f3f3">
                    <div class="sub-category f-14 pd-10" id="">
                        <h2 class="border-b">子栏目导航</h2>
                        <%for(let i=0,item;i<data.subNav.length;i++){%>
                            <%item = data.subNav[i];%>
                            <span class="ml-4 mr-4"><a href="/list/<%=item.id%>"><%=item.nav_name%></a></span>
                        <%}%>
                    </div>
     
                    <div class="pd-10 bg-f3f3f3 mb-10">
                            <h2>本类本月推荐</h2>
                            <ul class="mt-10">
                                <%for(let i=0,item;i<data.articleRec.length;i++){%>
                                    <%item = data.articleRec[i];%>
                                    <li><a href="/article/<%=item.id%>"><%=item.title%></a><time class="fr c-999"><%=item.date.substring(5,10)%></time></li>
                                <%}%>
                            </ul>
                        </div>
         
                        <div class="pd-10 bg-f3f3f3 mb-10">
                            <h2>本类本月热门</h2>
                            <ul class="mt-10">
                                <%for(let i=0,item;i<data.articleHot.length;i++){%>
                                    <%item = data.articleHot[i];%>
                                    <li><a href="/article/<%=item.id%>"><%=item.title%></a><time class="fr c-999"><%=item.date.substring(5,10)%></time></li>
                                <%}%>
                            </ul>
                        </div>
         
                        <div class="pd-10 bg-f3f3f3 mb-10">
                            <h2>本类本月图文</h2>
                            <ul class="mt-10">
                                <%for(let i=0,item;i<data.articlePic.length;i++){%>
                                    <%item = data.articlePic[i];%>
                                    <li><a href="/article/<%=item.id%>"><%=item.title%></a><time class="fr c-999"><%=item.date.substring(5,10)%></time></li>
                                <%}%>
                            </ul>
                        </div>
            </div>
         </section>

         <% include global/footer.html %>
         <% include global/footer-js.html %>
         <script>
        var vm = new Vue({
            el:'.content',
            data:{
                level:{}
            },
            methods:{
                page:function(){
                    var pageNo = $m.getParams('page');
                    if(pageNo<=0){
                        pageNo = 1;
                    }

                    if(pageNo>parseInt('<%=pageTotal%>')){
                        pageNo = parseInt('<%=pageTotal%>');
                    }

                    Page({
                        num:parseInt('<%=pageTotal%>'),	//页码数
                        startnum:pageNo,				//指定页码
                        elem:$('#page2'),		//指定的元素
                        callback:function(n){	//回调函数
                            console.log(n);
                            location.href=location.pathname+"?page="+n
                        }
                    });
                }
            },
            created:function(){
                this.page();
                
            },
            mounted:function(){
                
            },
            updated:function(){
                
            }
        });
        
    </script>
</body>
</html>